<style>
    .show-input{
        line-height: 38px;
    }
</style>
<div class="layui-tab layui-tab-brief tool-tab" lay-filter="tool-tab">
    <ul class="layui-tab-title text-center">
        <li class="layui-this">{$tool_info.title}</li>
        <li>接口说明</li>
    </ul>
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
            <div class="layui-row">
                <blockquote class="layui-elem-quote tools-title">
                    <p>说明：</p>
                    <ol>
                        <li>可以不写[http://]，但是必须写[https://]</li>
                    </ol>
                </blockquote>
                <form action="">
                    <div class="yw-search">
                        <input type="text" name="url" value="https://www.instagram.com/p/CN4s6eRnsaa/?igshid=axc6piukelov" class="layui-input" placeholder="请输入要获取的url">
                        <button type="button" class="layui-btn layui-btn-normal"><i class="layui-icon layui-icon-search"></i> 获取</button>
                    </div>
                </form>
                <div class="layui-card">
                    <div class="layui-card-header">
                        返回结果
                    </div>
                    <div class="layui-card-body text-center" id="show_rs">
                        <img src="https://api.wjssk.ga/favicon?url=">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-tab-item">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">api接口</label>
                    <div class="layui-input-block">
                        <p class="show-input">https://api.wjssk.ga/favicon</p>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">请求方法</label>
                    <div class="layui-input-block">
                        <p class="show-input">GET</p>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">参数说明</label>
                    <div class="layui-input-block">
                        <table class="layui-table" lay-size="sm" lay-skin="line">
                            <tbody>
                            <tr>
                                <td>url</td>
                                <td>需要获取favicon图标的网站地址</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">注意事项</label>
                    <div class="layui-input-block">
                        <p class="show-input">可以不写[http://]，但是必须写[https://]</p>
                    </div>
                </div>
                <div class="layui-form-item">
                    <pre class="layui-code" lay-title="实例演示" lay-skin="notepad">https://api.wjssk.ga/favicon?url=https://tools.wjssk.ga
                    </pre>
                </div>
            </form>
        </div>
    </div>
</div>
<script>
    layui.use(['jquery','element','code'], function () {
        var $ = layui.jquery,
            E = layui.element;
        layui.code({
            elem: 'pre'
        });
        $('.yw-search').on('click','button',function (){
            var url = $('input[name="url"]').val();
            $('#show_rs img').attr('src','https://api.wjssk.ga/favicon?url='+url);
        });

        function get_hostname(url) {
            var m = url.match(/^http:\/\/[^/]+/);
            return m ? m[0] : null;
        }
    });
</script>